<script>
import tree from '@/mixins/tree/index.js'
import AjaxStore from '@/utils/store/proxyAjax'
import store from './store.js'
import { validateNumber } from '@/utils/validate'
import GroupTree from '@/components/DatagroupTree'
import DialogForm from '@/components/DialogForm'
import ButtonList from '@/components/ButtonList'
import WrapTable from '@/components/WrapTable'

export default {
  name: 'sitedefault',
  mixins: [tree, store],
  components: {
    GroupTree,
    DialogForm,
    ButtonList
  },
  data() {
    const validateOrderNo = (rule, value, callback) => {
      if (value && !validateNumber(value)) {
        callback(new Error('请输入正整数'))
      } else {
        callback()
      }
    }
    return {
      page: 1,
      limit: 10,
      functionId: '',
      projectIds: [],
      projectIdArr: [],
      editPid: '',
      pidLabel: '',
      funName: '',
      dialogType: '',
      divWidthPercent: 16,
      divWidthOffset: 0,
      searchInputWidthPercent: 8,
      searchInputWidthOffset: 0,

      labelWidth: '100px',

      tree: {
        width: '280',
        accordion: false,
        isShowHeader: true,
        treeMenuButtonList: this.treeMenuBtns,
        treeOperateButtonList: this.treeOperateBtns,
        search: {
          searchKey: 'nodeName'
        },
        showCheckbox: false,
        selectTree: {},
        nextNodeKey: 'node',
        idKey: 'funId',
        title: '站点菜单树',
        getNextChildNode: this.getNextNode,
        delNode: this.delNode
      },

      nodeIdKey: 'id',
      nodeLabelKey: 'text',
      pidKey: 'pid',
      idKey: 'funId',
      labelKey: 'funName',
      currentNode: null,
      panelType: '',
      inputPlaceholder: '请输入站点名称',

      addNodeInfoUrl: '/v1/yq/projectdefaultfunction/add',
      updateNodeInfoUrl: '/v1/yq/projectdefaultfunction/update',
      getNextNodeUrl: '/v1/yq/projectdefaultfunction/findNextChildNodeTree',
      delNodeUrl: '/v1/yq/projectdefaultfunction/deleteNode',
      getNodeInfoUrl: '/v1/yq/projectdefaultfunction/findById',
      store: new AjaxStore({
        url: '/v1/yq/projectdefaultfunction/query'
      }),
      syncStore: new AjaxStore({
        url: '/v1/yq/project/query'
      }),
      containerList: [],
      selectedList: [],
      columns: [
        {
          prop: 'projectNo',
          label: '编码',
          sortable: true,
          'min-width': '240',
          'header-align': 'center'
        },
        {
          prop: 'projectName',
          label: '名称',
          'min-width': '240',
          'header-align': 'center'
        }
      ],

      formPanel: {
        add: {
          model: {
            funId: '',
            funName: '',
            funType: '',
            location: '',
            pid: '',
            orderNo: '',
            helpUrl: '',
            openNew: false,
            logFlag: 0,
            icon: '',
            version: '',
            remark: '',
            fullPath: ''
          },
          fields: [
            {
              label: '父菜单',
              prop: 'pid',
              anchor: 24,
              xType: 'SelectTree.TREE',
              ref: 'addPid',
              relatedFields: ['addFunPath'],
              treeParams: {
                get: {
                  url: '/v1/yq/projectdefaultfunction/findNextChildNodeTree',
                  nextNodeKey: 'node',
                  idKey: 'id'
                }
              },
              valueToLabelParams: {
                url: '/v1/yq/projectdefaultfunction/findNameById',
                idKey: 'funId'
              },
              on: {
                'visible-change': val =>
                  val && this.$refs.addForm.$refs.addPid.reload()
              }
            },
            {
              label: '菜单类型',
              prop: 'funType',
              xType: 'SelectCode.FUN_TYPE',
              placeholder: '选择菜单类型',
              anchor: 24,
              relatedFields: ['addHelpUrl', 'addOpenNew']
            },
            {
              label: '菜单名称',
              prop: 'funName',
              placeholder: '输入菜单名称',
              anchor: 24,
              on: {
                input: val => {
                  this.funName = val
                  if (!this.formPanel.add.model.pid) {
                    this.formPanel.add.model.fullPath = this.filterArray([
                      this.funName
                    ]).join('/')
                  } else {
                    const selectPidLabel = this.$refs.addForm.$refs.addPid
                      .selectedLabel
                    this.formPanel.add.model.fullPath = this.filterArray([
                      this.getFrontStr(this.fullPath, selectPidLabel),
                      this.funName
                    ]).join('/')
                  }
                }
              }
            },
            {
              label: '链接',
              prop: 'location',
              placeholder: '输入链接',
              anchor: 24
            },
            {
              label: '排序号',
              prop: 'orderNo',
              placeholder: '输入排序号',
              anchor: 24
            },
            {
              label: '帮助页Url',
              prop: 'helpUrl',
              placeholder: '输入帮助页Url',
              ref: 'addHelpUrl',
              anchor: 24,
              class: 'help-url',
              on: {
                'el.form.update': (val, ctx, origin, form) => {
                  // 值,当前组件,关联组件
                  const helpUrlFormItem = document.getElementsByClassName(
                    'help-url'
                  )[0].parentNode.parentNode
                  form.model.helpUrl = ''
                  if (form.model.funType === 2) {
                    helpUrlFormItem.classList.remove(
                      'sitedefault-item-display-none'
                    )
                    this.labelWidth = '170px'
                  } else {
                    this.labelWidth = '100px'
                    helpUrlFormItem.classList.add(
                      'sitedefault-item-display-none'
                    )
                  }
                }
              }
            },
            {
              label: '是否以新窗口的方式打开',
              prop: 'openNew',
              xType: 'switch',
              ref: 'addOpenNew',
              anchor: 24,
              'active-value': true,
              'inactive-value': false,
              class: 'open-new',
              on: {
                'el.form.update': (val, ctx, origin, form) => {
                  // 值,当前组件,关联组件
                  const openNewFormItem = document.getElementsByClassName(
                    'open-new'
                  )[0].parentNode.parentNode
                  form.model.openNew = false
                  if (form.model.funType === 2) {
                    this.labelWidth = '170px'
                    openNewFormItem.classList.remove(
                      'sitedefault-item-display-none'
                    )
                  } else {
                    this.labelWidth = '100px'
                    openNewFormItem.classList.add(
                      'sitedefault-item-display-none'
                    )
                  }
                }
              }
            },
            {
              label: '是否记日志',
              prop: 'logFlag',
              xType: 'switch',
              anchor: 24,
              'active-value': 1,
              'inactive-value': 0
            },
            {
              label: '图标',
              prop: 'icon',
              placeholder: '输入图标',
              anchor: 24
            },
            {
              label: '版本',
              prop: 'version',
              placeholder: '输入版本',
              anchor: 24
            },
            {
              label: '备注',
              prop: 'remark',
              placeholder: '输入备注',
              anchor: 24
            },
            {
              label: '全路径',
              prop: 'fullPath',
              anchor: 24,
              readonly: true,
              style: 'border: 0;',
              ref: 'addFunPath',
              on: {
                'el.form.update': (val, ctx, origin, form) => {
                  // 值,当前组件,关联组件
                  if (form.model.pid) {
                    this.getNodeInfo({ funId: form.model.pid }).then(
                      ({ success, data }) => {
                        if (success && data.fullPath) {
                          // 获取上级机构全路径
                          this.fullPath = data.fullPath
                          this.formPanel.add.model.fullPath = this.filterArray([
                            this.getFrontStr(
                              this.fullPath,
                              origin.selectedLabel
                            ),
                            form.model.funName
                          ]).join('/')
                        }
                      }
                    )
                  } else {
                    form.model.fullPath = this.filterArray([
                      form.model.funName
                    ]).join('/')
                  }
                }
              }
            }
          ],
          rules: {
            funId: [
              { required: true, message: '请输入菜单编码', trigger: 'blur' }
            ],
            funName: [
              { required: true, message: '请输入菜单名称', trigger: 'blur' }
            ],
            funType: [
              { required: true, message: '请输入菜单类型', trigger: 'change' }
            ],
            orderNo: [{ validator: validateOrderNo, trigger: 'blur' }]
            // "logFlag": [{ required: true, message: '请输入是否记日志', trigger: 'blur' }],
          },
          title: '新增站点菜单',
          type: 'ADD',
          ref: 'addForm',
          submitBtnList: this.addBtns
        },
        edit: {
          model: {
            funId: '',
            funName: '',
            funType: '',
            location: '',
            pid: '',
            orderNo: '',
            helpUrl: '',
            openNew: false,
            logFlag: 0,
            icon: '',
            version: '',
            remark: '',
            fullPath: ''
          },
          fields: [
            {
              label: '父菜单',
              prop: 'pid',
              anchor: 24,
              xType: 'SelectTree.TREE',
              ref: 'editPid',
              relatedFields: ['editFunPath'],
              on: {
                update: (val, vnode, form) => {
                  const selfId = this.editPid
                  const $tree = vnode.$refs.tree
                  const path = $tree.getNodePath(val) || []
                  for (let i = 0, len = path.length; i < len; i++) {
                    if (selfId === path[i]['id']) {
                      form.model.pid = ''
                      this.$message({
                        type: 'error',
                        message: '父菜单不能选择自身或自己的子节点！'
                      })
                      break
                    }
                  }
                },
                'visible-change': val =>
                  val && this.$refs.editForm.$refs.editPid.reload()
              },
              // 下拉树参数
              treeParams: {
                get: {
                  url: '/v1/yq/projectdefaultfunction/findNextChildNodeTree',
                  nextNodeKey: 'node',
                  idKey: 'id'
                }
              },
              valueToLabelParams: {
                url: '/v1/yq/projectdefaultfunction/findNameById',
                idKey: 'funId'
              }
            },
            {
              label: '菜单类型',
              prop: 'funType',
              xType: 'SelectCode.FUN_TYPE',
              placeholder: '选择菜单类型',
              anchor: 24,
              relatedFields: ['editHelpUrl', 'editOpenNew']
            },
            // { label: '菜单编码', prop: 'funId', placeholder: '输入菜单编码', anchor: 24, disabled: true},
            {
              label: '菜单名称',
              prop: 'funName',
              placeholder: '输入菜单名称',
              anchor: 24,
              on: {
                input: val => {
                  this.funName = val
                  if (!this.formPanel.edit.model.pid) {
                    this.formPanel.edit.model.fullPath = this.filterArray([
                      this.funName
                    ]).join('/')
                  } else {
                    const selectPidLabel = this.$refs.editForm.$refs.editPid
                      .selectedLabel
                    this.formPanel.edit.model.fullPath = this.filterArray([
                      this.getFrontStr(this.fullPath, selectPidLabel),
                      this.funName
                    ]).join('/')
                  }
                }
              }
            },
            {
              label: '链接',
              prop: 'location',
              placeholder: '输入链接',
              anchor: 24
            },
            {
              label: '排序号',
              prop: 'orderNo',
              placeholder: '输入排序号',
              anchor: 24
            },
            {
              label: '帮助页Url',
              prop: 'helpUrl',
              placeholder: '输入帮助页Url',
              ref: 'editHelpUrl',
              anchor: 24,
              class: 'help-url',
              on: {
                'el.form.update': (val, ctx, origin, form) => {
                  // 值,当前组件,关联组件
                  const helpUrlFormItem = document.getElementsByClassName(
                    'help-url'
                  )[0].parentNode.parentNode
                  form.model.helpUrl = ''
                  if (form.model.funType === 2) {
                    helpUrlFormItem.classList.remove(
                      'sitedefault-item-display-none'
                    )
                    this.labelWidth = '170px'
                  } else {
                    this.labelWidth = '100px'
                    helpUrlFormItem.classList.add(
                      'sitedefault-item-display-none'
                    )
                  }
                }
              }
            },
            {
              label: '是否以新窗口的方式打开',
              prop: 'openNew',
              xType: 'switch',
              ref: 'editOpenNew',
              anchor: 24,
              'active-value': true,
              'inactive-value': false,
              class: 'open-new',
              on: {
                'el.form.update': (val, ctx, origin, form) => {
                  // 值,当前组件,关联组件
                  const openNewFormItem = document.getElementsByClassName(
                    'open-new'
                  )[0].parentNode.parentNode
                  form.model.openNew = false
                  if (form.model.funType === 2) {
                    this.labelWidth = '170px'
                    openNewFormItem.classList.remove(
                      'sitedefault-item-display-none'
                    )
                  } else {
                    this.labelWidth = '100px'
                    openNewFormItem.classList.add(
                      'sitedefault-item-display-none'
                    )
                  }
                }
              }
            },
            {
              label: '是否记日志',
              prop: 'logFlag',
              xType: 'switch',
              anchor: 24,
              'active-value': 1,
              'inactive-value': 0
            },
            // { label: '是否记日志', prop: 'logFlag', xType: 'SelectCode.IF', placeholder: '输入是否记日志', anchor: 24},
            {
              label: '图标',
              prop: 'icon',
              placeholder: '输入图标',
              anchor: 24
            },
            {
              label: '版本',
              prop: 'version',
              placeholder: '输入版本',
              anchor: 24
            },
            {
              label: '备注',
              prop: 'remark',
              placeholder: '输入备注',
              anchor: 24
            },
            {
              label: '全路径',
              prop: 'fullPath',
              anchor: 24,
              readonly: true,
              style: 'border: 0;',
              ref: 'editFunPath',
              on: {
                'el.form.update': (val, ctx, origin, form) => {
                  // 值,当前组件,关联组件
                  if (form.model.pid) {
                    this.getNodeInfo({ funId: form.model.pid }).then(
                      ({ success, data }) => {
                        if (success && data.fullPath) {
                          // 获取上级机构全路径
                          this.fullPath = data.fullPath
                          this.formPanel.edit.model.fullPath = this.filterArray(
                            [
                              this.getFrontStr(
                                this.fullPath,
                                origin.selectedLabel
                              ),
                              form.model.funName
                            ]
                          ).join('/')
                          console.log(
                            'test',
                            this.filterArray([
                              this.fullPath,
                              form.model.funName
                            ]),
                            this.filterArray([
                              this.getFrontStr(
                                this.fullPath,
                                origin.selectedLabel
                              ),
                              form.model.funName
                            ]).join('/')
                          )
                        }
                      }
                    )
                  } else {
                    form.model.fullPath = this.filterArray([
                      form.model.funName
                    ]).join('/')
                  }
                }
              }
            }
          ],
          rules: {
            funId: [
              { required: true, message: '请输入菜单编码', trigger: 'blur' }
            ],
            funName: [
              { required: true, message: '请输入菜单名称', trigger: 'blur' }
            ],
            funType: [
              { required: true, message: '请输入菜单类型', trigger: 'change' }
            ],
            orderNo: [{ validator: validateOrderNo, trigger: 'blur' }]
          },
          title: '编辑站点菜单',
          type: 'EDIT',
          ref: 'editForm',
          submitBtnList: this.editBtns
        }
      }
    }
  },
  computed: {
    data() {
      return this.syncStore.data
    },
    total() {
      return this.syncStore.total
    }
  },
  watch: {
    data: {
      // immediate: true,
      handler() {
        this.handleCheckCheckbox()
      }
    }
  },
  methods: {
    handleFormAdd() {
      return this.$refs.addForm
        .validate()
        .then(() => {
          let params = {}
          params = Object.assign(params, this.formPanel.add.model)
          if (params.funType !== 2) {
            delete params.helpUrl
            delete params.openNew
          }
          if (!this.formPanel.add.model.pid) {
            delete params.pid
          }
          return this.addNodeInfo(params)
        })
        .then(({ success, message }) => {
          this.$message({
            type: success ? 'success' : 'error',
            message: success
              ? '添加项目站点默认菜单成功！'
              : '添加项目站点默认菜单失败！'
          })
          if (success) {
            this.addLocalTree(this.formPanel.add.model)
          } else {
            throw new Error('添加项目站点默认菜单失败！')
          }
        })
        .catch(err => {
          console.log(err)
          return Promise.reject(err)
        })
    },
    handleFormEdit() {
      return this.$refs.editForm
        .validate()
        .then(() => {
          let params = {}
          params = Object.assign(params, this.formPanel.edit.model)
          if (params.funType !== 2) {
            delete params.helpUrl
            delete params.openNew
          }
          if (!this.formPanel.edit.model.pid) {
            delete params.pid
          }
          return this.updateNodeInfo(params)
        })
        .then(({ success, message }) => {
          this.$message({
            type: success ? 'success' : 'error',
            message: success
              ? '修改项目站点默认菜单成功！'
              : '修改项目站点默认菜单失败！'
          })
          if (success) {
            this.editLocalTree(this.formPanel.edit.model)
          } else {
            throw new Error('修改项目站点默认菜单失败！')
          }
        })
        .catch(err => {
          console.log(err)
          return Promise.reject(err)
        })
    },
    getFrontStr(str, reg) {
      return str.split(reg)[0] + reg
    },
    getTableData({ page, limit, q_cond = '', q_catId = '', q_filtertype = 1 }) {
      this.syncStore.read({
        start: page,
        limit,
        q_cond: q_cond,
        q_catId,
        q_filtertype
      })
      // .then(res => {
      //   this.containerList = res.data
      // })
    },
    // 处理生成弹窗
    handleSyncOrder(id) {
      this.dialogType = 'SYNCORDER'
      this.functionId = id // 所点击树节点的id

      this.$nextTick(() => {
        // 清空表格勾选状态
        this.containerList = []
        this.selectedList = []
        this.$refs.searchInput.clear()
        this.$refs.table.clearSelection()
        // 清除之前查询的结果的缓存
        this.syncStore._searchParams = {}
        this.$refs.table.load(1, this.limit)
      })
    },
    // 同步菜单弹框中的表格过滤
    handleInputClick(ev, val) {
      const params = {}
      params.q_cond = val
      this.syncStore._searchParams = params
      this.$refs.table.load(1, this.syncStore.limit)
    },
    // eslint-disable-next-line
    renderTree(h) {
      return (
        <GroupTree
          ref='tree'
          tree={this.tree}
          on-add-treeNode={this.handleNodeAdd}
          on-check-treeNode={this.handleNodeEdit}
          on-del-treeNode={this.handleNodeDel}
          on-tree-empty={this.handleTreeEmpty}
          on-tree-subSelect={this.handleTreeSubSelect}
          on-tree-import={this.handleTreeImport}
          node-str={this.cNodeStr}
          on-create-dialog={this.handleSyncOrder}></GroupTree>
      )
    },
    // 同步菜单
    handleSyncSite() {
      this.projectIds = this.containerList.map(item => {
        return item.projectId + ''
      })
      let data = {
        functionId: this.functionId,
        projectIds: this.projectIds
      }
      if (this.projectIds.length > 0) {
        return this.request({
          url: '/v1/yq/projectdefaultfunction/syncFunction',
          method: 'post',
          headers: {
            'Content-Type': 'application/json'
          },
          data: JSON.stringify(data)
        })
          .then(({ success, message }) => {
            this.$message({
              type: success ? 'success' : 'error',
              message
            })
            if (success) {
              this.dialogType = ''
            }
          })
          .catch(err => console.log(err))
      } else {
        this.$message({
          type: 'error',
          message: '请至少选择一个站点进行同步'
        })
      }
    },
    handleCancel() {
      this.dialogType = ''
      this.$refs.searchInput.clear()
    },
    handleSelectionChange(val) {
      this.selectedList = val
      for (let i = 0; i < this.selectedList.length; ++i) {
        let flag = false
        for (let j = 0; j < this.containerList.length; ++j) {
          if (
            this.containerList[j].projectId === this.selectedList[i].projectId
          ) {
            flag = true
            break
          }
        }
        !flag ? this.containerList.push(this.selectedList[i]) : ''
      }
    },
    handleSelect(selection, row) {
      let flag = false
      for (let i = 0; i < selection.length; ++i) {
        if (row.projectId === selection[i].projectId) {
          flag = true
          break
        }
      }
      // 取消单个勾选
      if (!flag) {
        for (let i = 0; i < this.containerList.length; ++i) {
          if (row.projectId === this.containerList[i].projectId) {
            this.containerList.splice(i, 1)
            break
          }
        }
      }
    },
    handleSelectAll(selection) {
      if (selection.length === 0) {
        for (let i = 0; i < this.syncStore.data.length; ++i) {
          for (let j = 0; j < this.containerList.length; ++j) {
            if (
              this.syncStore.data[i].projectId ===
              this.containerList[j].projectId
            ) {
              this.containerList.splice(j, 1)
              break
            }
          }
        }
      }
    },
    handleCheckCheckbox() {
      this.$nextTick(() => {
        for (let i = 0; i < this.containerList.length; ++i) {
          for (let j = 0; j < this.syncStore.data.length; ++j) {
            if (
              this.containerList[i].projectId ===
              this.syncStore.data[j].projectId
            ) {
              this.$refs.table.toggleRowSelection(this.syncStore.data[j], true)
              break
            }
          }
        }
      })
    },
    // eslint-disable-next-line
    renderWrapTable(h) {
      return (
        <WrapTable
          ref='table'
          class='sync-order-table'
          getData={this.getTableData}
          total={this.total}
          data={this.data}
          fields={this.columns}
          selectionCol={true}
          indexCol={true}
          pagination={true}
          autoLoad={true}
          tooltip-effect='dark'
          border
          stripe
          default-sort={this.tableDefaultSort}
          on-selection-change={this.handleSelectionChange}
          on-select={this.handleSelect}
          on-select-all={this.handleSelectAll}
          // on-selection-change={ this.handleSelectionChange }
          // on-row-dblclick={ this.handleCurrentChange }
        >
          <c-row slot='toolPanel' class='toolPanel'>
            <c-col span={this.divWidthPercent} offset={this.divWidthOffset}>
              <div>
                <b>请选择同步站点</b>
              </div>
            </c-col>
            <c-col
              span={this.searchInputWidthPercent}
              justify='end'
              offset={this.searchInputWidthOffset}>
              <c-input
                class='search-input'
                placeholder={this.inputPlaceholder}
                size='small'
                ref='searchInput'
                on-input={event => {
                  this.searchInput = event
                }}
                nativeOnKeydown={ev => {
                  ev.keyCode === 13
                    ? this.handleInputClick(ev, this.searchInput)
                    : null
                }}>
                <i
                  slot='suffix'
                  class='el-input__icon el-icon-search'
                  on-click={ev =>
                    this.handleInputClick(ev, this.searchInput)
                  }></i>
              </c-input>
            </c-col>
          </c-row>
        </WrapTable>
      )
    },
    // eslint-disable-next-line
    renderCustom(h) {
      // 在这里实现你的弹窗
      return (
        <DialogForm
          width='720px'
          key={'ceateDialog'}
          visible={this.dialogType === 'SYNCORDER'}
          title={'同步站点'}
          on-close={this.handleCancel}>
          {this.renderWrapTable(h)}
          <c-form ref='form' slot='footer'>
            <c-form-item class='submit-btn'>
              <ButtonList operateBtnList={this.submitBtnList}></ButtonList>
            </c-form-item>
          </c-form>
        </DialogForm>
      )
    }
  },
  beforeCreate() {
    // 根据页面路由找出有权限访问的 url 数组
    const urlArr = ((this.$route.meta && this.$route.meta.children) || []).map(
      item => item.url
    )

    // 根据权限 url 数组过滤出能够使用的 按钮数组
    this.addBtns = [
      {
        label: '保存',
        methods: 'handleFormAdd',
        url: '/v1/yq/projectdefaultfunction/add',
        icon: 'el-icon-circle-check-outline',
        type: 'primary',
        disabled: false
      }
    ].filter(item => (item.url && urlArr.includes(item.url)) || !item.url)

    this.editBtns = [
      {
        label: '保存',
        methods: 'handleFormEdit',
        url: '/v1/yq/projectdefaultfunction/update',
        icon: 'el-icon-circle-check-outline',
        type: 'primary',
        disabled: false
      }
    ].filter(item => (item.url && urlArr.includes(item.url)) || !item.url)

    this.treeMenuBtns = [
      {
        label: '新增',
        methods: 'handleMenuAdd',
        url: '/v1/yq/projectdefaultfunction/add',
        icon: 'el-icon-circle-plus-outline',
        type: 'text',
        action: 'plus'
      },
      {
        label: '刷新',
        methods: 'refresh',
        url: '/v1/yq/projectdefaultfunction/findNextChildNodeTree',
        icon: 'el-icon-refresh',
        type: 'text'
      },
      {
        label: '展开',
        methods: 'expand',
        url: '/v1/yq/projectdefaultfunction/findNextChildNodeTree',
        icon: 'el-icon-rank',
        type: 'text'
      },
      {
        label: '折叠',
        methods: 'fold',
        url: '',
        icon: 'el-icon-arrow-up',
        type: 'text'
      }
    ].filter(item => (item.url && urlArr.includes(item.url)) || !item.url)

    this.submitBtnList = [
      {
        label: '同步',
        methods: 'handleSyncSite',
        url: '',
        icon: 'el-icon-circle-check-outline',
        type: 'primary',
        disabled: false
      },
      {
        label: '取消',
        methods: 'handleCancel',
        url: '',
        icon: 'el-icon-circle-close-outline',
        disabled: false
      }
    ].filter(item => (item.url && urlArr.includes(item.url)) || !item.url)

    this.treeOperateBtns = data => {
      // 根据 systemType 帅选
      let btnList = []
      !data.systemType
        ? (btnList = [
            {
              type: 'text',
              url: '/v1/yq/projectdefaultfunction/add',
              icon: 'el-icon-plus',
              action: 'plus'
            },
            {
              type: 'text',
              url: '/v1/yq/projectdefaultfunction/deleteNode',
              icon: 'el-icon-delete',
              action: 'delete'
            },
            { type: 'text', url: '', icon: 'el-icon-sort', action: 'syncSite' }
          ].filter(
            item => (item.url && urlArr.includes(item.url)) || !item.url
          ))
        : (btnList = [
            {
              type: 'text',
              url: '/v1/yq/projectdefaultfunction/add',
              icon: 'el-icon-plus',
              action: 'plus'
            },
            {
              type: 'text',
              url: '/v1/yq/projectdefaultfunction/deleteNode',
              icon: 'el-icon-remove',
              action: 'delete'
            },
            { type: 'text', url: '', icon: 'el-icon-sort', action: 'syncSite' }
          ].filter(
            item => (item.url && urlArr.includes(item.url)) || !item.url
          ))
      return btnList
    }
  }
}
</script>

<style lang="scss">
.sitedefault {
  .right {
    .submit-btn {
      display: flex;
      justify-content: flex-end;
    }
  }
}
.sync-order-table {
  .el-input__suffix {
    cursor: pointer;
    border-left: 1px solid #e6e6e6;
  }
  .el-select {
    width: auto !important;
  }
}
.sitedefault-item-display-none {
  display: none;
}
</style>
